import '@/styles/index.scss' // global css

import Vue from 'vue'
import { sync } from 'vuex-router-sync'

import 'normalize.css/normalize.css'// A modern alternative to CSS resets

import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

import App from './App'

import store from './store'
import router from './router'

import mixins from './utils/mixins/index'
// directive
import waves from './utils/directive/waves'
import clipboard from './utils/directive/clipboard'
import * as filters from './utils/filters/index' // global filters

// import './permission' // permission control
import '@/components/icons' // svg组件
import myImage from '@/components/my-image' // 预览图片

sync(store, router)

Vue.use(Element, {
  size: 'small' // set element-ui default size
})

// directive
Vue.use(clipboard)
Vue.use(waves)

// component
Vue.component('my-image', myImage)

// mixins
Vue.mixin(mixins)

// filter
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key])
})

Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  store,
  template: '<App/>',
  components: { App }
})
